import { fmtMw, fmtUsd, placeLine } from "@/lib/format";
import { fmtPartialDateSafe } from "@/lib/format-project";
import { STATUS_LABEL } from "@/lib/labels";
import { OG_CONTENT_TYPE, OG_SIZE, renderOg } from "@/lib/og-template";
import { getProject } from "./data";

export const alt = "Data center project — DataCenterIndex";
export const size = OG_SIZE;
export const contentType = OG_CONTENT_TYPE;
export const revalidate = 3600;

export default async function Image({ params }: { params: Promise<{ slug: string }> }) {
  const { slug } = await params;
  const r = await getProject(slug);
  if (!r.ok) return renderOg({ eyebrow: "Project", title: "Data center project", subtitle: "DataCenterIndex — announced, permitted and under-construction projects." });
  const p = r.data;
  const place = placeLine(p);
  return renderOg({
    eyebrow: "Project",
    title: p.name.length > 90 ? `${p.name.slice(0, 87)}…` : p.name,
    subtitle: [p.operator?.name, place !== "—" ? place : null].filter(Boolean).join(" · ") || undefined,
    stats: [
      { label: "Planned MW", value: p.plannedMw === null ? "—" : `≈ ${fmtMw(p.plannedMw)}` },
      { label: "Investment", value: p.investmentUsd === null ? "—" : fmtUsd(p.investmentUsd) },
      { label: "Status", value: STATUS_LABEL[p.status] },
      { label: "Expected", value: p.expectedOpening ? fmtPartialDateSafe(p.expectedOpening) : "TBD" },
    ],
  });
}